<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout">

<head>

	<title>sport activity </title>
	<!-- Meta Tags -->
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
	<meta name="author" content="Webestica.com">
	<meta name="description" content="Technology and Corporate Bootstrap Theme">

	<!-- Favicon -->
	<link rel="shortcut icon" th:href="@{/favicon.ico}">

	<script th:src="@{/plug/jQuery-2.1.4.min.js}"></script>
	<script>
	let ctx = window.location.origin;
	
	</script>

	<!-- Plugins CSS -->
	<link rel="stylesheet" type="text/css" th:href="@{/assets/vendor/font-awesome/css/all.min.css}">
	<link rel="stylesheet" type="text/css" th:href="@{/assets/vendor/bootstrap-icons/bootstrap-icons.css}">

	<!-- Theme CSS -->
	<link rel="stylesheet" type="text/css" th:href="@{/assets/css/style.css}">
	
	<!-- My Plugins CSS -->
	<link rel="stylesheet" type="text/css" th:href="@{/plug/bootstrap-table/bootstrap-table.css}">
	<link rel="stylesheet" type="text/css" th:href="@{/plug/datapicker/bootstrap-datetimepicker.min.css}">
	<link rel="stylesheet" type="text/css" th:href="@{/plug/file-upload/index.css}">
	<link rel="stylesheet" type="text/css" th:href="@{/plug/layer/css/layer.css}">
	<link rel="stylesheet" type="text/css" th:href="@{/plug/select2/select2.min.css}">
	<link rel="stylesheet" type="text/css" th:href="@{/plug/select2/select2-bootstrap.min.css}">
	<link rel="stylesheet" type="text/css" th:href="@{/plug/timepicker/bootstrap-timepicker.min.css}">

	<!-- My Plugins JS -->
	<script th:src="@{/plug/jquery.cookie.min.js}"></script>
	<script th:src="@{/plug/bootstrap-table/bootstrap-table.js}"></script>
	<script th:src="@{/plug/datapicker/bootstrap-datetimepicker.js}"></script>
	<script th:src="@{/plug/file-upload/index.js}"></script>
	<script th:src="@{/plug/layer/layer.min.js}"></script>
	<script th:src="@{/plug/select2/select2.js}"></script>
	<script th:src="@{/plug/timepicker/bootstrap-timepicker.js}"></script>
	<script th:src="@{/plug/validate/jquery.validate.min.js}"></script>
	<script th:src="@{/plug/wangEditor/wangEditor.min.js}"></script>
	<script th:src="@{/plug/wangEditor/index.js}"></script>
	<style>
		.error {
			color: orangered
		}
	</style>

</head>

<body>

	<!-- Header START -->
	<header class="header-sticky header-absolute">
		<!-- Logo Nav START -->
		<nav class="navbar navbar-expand-xl">
			<div class="container">
				<!-- Logo START -->
				<a class="navbar-brand me-0" th:href="@{/}">
					<img class="light-mode-item navbar-brand-item" th:src="@{/img/bootstrap-logo-shadow.png}" alt="logo">
				</a>
				<!-- Logo END -->

				<!-- Main navbar START -->
				<div class="navbar-collapse collapse" id="navbarCollapse">
					<ul class="navbar-nav navbar-nav-scroll dropdown-hover mx-auto">

						<!-- Nav item -->
						<li class="nav-item"> <a class="nav-link sp-link-a" th:href="@{/}">Home</a> </li>

						<!-- Nav item -->
						<li class="nav-item"> <a class="nav-link sp-link-a" th:href="@{/list}">List</a> </li>

						<!-- Nav item -->
						<li class="nav-item"> <a class="nav-link sp-link-a" th:href="@{/law}">Law</a> </li>

						<!-- Nav item -->
						<li class="nav-item"> <a class="nav-link sp-link-a" th:href="@{/about}">Team</a> </li>

						<!-- Nav item -->
						<li class="nav-item" th:if="${session.user != null}"> <a class="nav-link sp-link-a" th:href="@{/user/order}">Orders</a> </li>

						<!-- Nav item -->
						<li class="nav-item" th:if="${session.user != null}"> <a class="nav-link sp-link-a" th:href="@{/user/review}">Reviews</a> </li>

						<!-- Nav item -->
						<li class="nav-item" th:if="${session.user != null}"> <a class="nav-link sp-link-a" th:href="@{/user/account}">Account</a> </li>
					</ul>
				</div>
				<!-- Main navbar END -->

				<!-- Buttons -->
				<ul class="nav align-items-center dropdown-hover ms-sm-2">

					<!-- Sign up button -->
					<li class="nav-item me-2" th:if="${session.user == null}">
						<a th:href="@{/user/signin}" class="btn btn-sm btn-light mb-0"><i
								class="bi bi-person-circle me-1"></i>Sign in</a>
					</li>
					<li class="nav-item me-2" th:if="${session.user != null}">
						<a th:href="@{/user/account}" class="btn btn-sm btn-light mb-0"><i
								class="bi bi-person-circle me-1"></i>[[${session.user.user}]]</a>
					</li>
					<li class="nav-item me-2" th:if="${session.user != null}">
						<a th:href="@{/user/logout}" class="btn btn-text mb-0 text-danger"><i
								class="bi bi-box-arrow-in-right me-1"></i>Logout</a>
					</li>
				</ul>

			</div>
		</nav>
		<!-- Logo Nav END -->
	</header>
	<!-- Header END -->

	<!-- **************** MAIN CONTENT START **************** -->
	<main>

		<!-- =======================
Contact info & Map START -->
		<div layout:fragment="fragment_body"></div>
		<!-- =======================
Contact info & Map END -->

	</main>
	<!-- **************** MAIN CONTENT END **************** -->

	<!-- =======================
Footer START -->
	<footer class="bg-dark position-relative overflow-hidden" data-bs-theme="dark">

		<div class="container position-relative mt-5">

			<!-- Bottom footer -->
			<div class="d-md-flex justify-content-between align-items-center text-center text-lg-start py-4">
				<!-- copyright text -->
				<div class="text-body"> Copyrights ©2024 SPORT ACTIVITY. </div>
				<!-- copyright links-->
			</div>
		</div>
	</footer>
	<!-- =======================
Footer END -->

	<!-- Back to top -->
	<div class="back-top"></div>

	<!-- Bootstrap JS -->
	<script th:src="@{/assets/vendor/bootstrap/dist/js/bootstrap.bundle.min.js}"></script>

	<!-- Theme Functions -->
	<script th:src="@{/assets/js/functions.js}"></script>
	
	<script>
		document.querySelectorAll('.sp-link-a')
			.forEach(function(element){
				var path = window.location.pathname
				//if(orgAuthUrl == path){
					//path = orgInfoUrl
				//}
				console.log(path)
				console.log(element.getAttribute('href'))
				if(path == element.getAttribute('href')){
					element.classList.add("active");
				}
			})
	</script>
	<th:block layout:fragment="fragment_script" />

</body>

</html>